<template>
	<view>
		<view class="status_bar">
		</view>

		<view class="friend_top">
			<view class="friend_top_left">
				<image src="@/static/Myimg/zuo1.png" mode=""></image>
			</view>
			<view class="friend_conten">
				<u-sticky bgColor="#fff">
					<u-tabs :list="list1" lineColor="#de425e" lineWidth="70rpx" lineHeight="10rpx"
						@click="click"></u-tabs>
				</u-sticky>
			</view>
			<view class="friend_right"></view>
		</view>
		<view class="fEO">
			<followEachOtherVue></followEachOtherVue>
		</view>
	</view>
</template>

<script>
	import followEachOtherVue from '@/pages/My/components/followEachOther.vue';
	export default {
		components:{
			followEachOtherVue
		},
		data() {
			return {
				list1: [{
						name: '相互关注',
					}, {
						name: '关注',
					}, {
						name: '粉丝'
					},
					{
						name: '推荐',
					}
				]
			}
		},
		methods: {
			click(index,item) {
				console.log(index,item);
			}
		}
	}
</script>

<style scoped>
	.status_bar {
		height: var(--status-bar-height);
		width: 100%;
	}

	.friend_top_left {
		width: 80rpx;
		height: 80rpx;
	}

	.friend_top {
		width: 100%;
		height: 150rpx;
		display: flex;
		justify-content: space-evenly;
		align-items: center;
	}

	.friend_top_left {
		width: 80rpx;
		height: 80rpx;
	}

	.friend_top_left image {
		width: 80%;
		height: 80%;
		object-fit: cover;
		object-position: center;
	}
	.friend_right{
		width: 80rpx;
	}
</style>